<template>
  <div class="box1">
    <el-dropdown trigger="click" @command="dees" :size="size">
      <!-- 用户头像 -->
      <span class="el-dropdown-link">
        <img :src="imge" alt="" />
      </span>
      <template #dropdown>
        <el-dropdown-menu>
          <el-dropdown-item class="iconfont icon-yonghu1" :command="{ id: 1 }"
            >个人信息</el-dropdown-item
          >
          <el-dropdown-item class="iconfont icon-mima" :command="{ id: 2 }"
            >密码修改</el-dropdown-item
          >
          <el-dropdown-item
            class="iconfont icon-youjiantou"
            :command="{ id: 3 }"
            >退出登录</el-dropdown-item
          >
        </el-dropdown-menu>
      </template>
    </el-dropdown>
  </div>
</template>

<script>
import axios from "axios";
import QS from "qs"; //创建文件自带插件，可以直接引用(转型)
import Cookies from "js-cookie"; //引用cookies
import { mapState, mapGetters, mapActions } from "vuex";
import http from "@/http";

export default {
  data() {
    return {
      imge: "",
    };
  },
  computed: {
    ...mapGetters(["user"]),
  },
  created() {
    this.heads();
  },
  methods: {
    ...mapActions(["Logout", "admins"]),
    heads() {
      let data = {
        _gp: "admin",
        _mt: "info",
      };
      http.post(data).then((res) => {
        console.log(res);
        if (200 == res.errno) {
          this.imge = res.data.avatarUrl;
          this.admins(data);
          this.$store.state.addusermodules.user = res.data.perms;
          // console.log(this.$store.state.addusermodules.user);
        }
      });
    },
    dees(data) {
      switch (data.id) {
        case 1: //跳转到个人资料页面
          this.$router.push("/home/useras");
          break;
        case 2: //跳转到修改密码页面
          this.$router.push("/home/changcode");
          break;
        case 3: //退出登录
          this.Logout();
          break;
        default:
          break;
      }
    },
  },
};
</script>

<style lang="less" scoped>
.box1 {
  height: 30px;
  width: 30px;
  border-radius: 50%;
  img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
  }
}
</style>
